@extends('admin.base.parent')
@section('content')
	<div class="main-content">
		<div class="breadcrumbs" id="breadcrumbs">
			<script type="text/javascript">
				try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
			</script>

			<ul class="breadcrumb">
				<li>
					<i class="icon-home home-icon"></i>
					<a href="#">主页</a>
				</li>
				<li>
					<a href="#">商品详情页</a>
				</li>
				<li class="active">添加商品</li>
			</ul><!-- .breadcrumb -->
		</div>

		<div class="page-content">
			<div class="page-header">
				<h1>
					添加商品
					<small>
						<i class="icon-double-angle-right"></i>
						商品详情
					</small>
				</h1>
			</div><!-- /.page-header -->
			@if(count($errors)> 0)
				<div class='alert alert-danger'>
					<ul>
						@foreach($errors->all() as $error)
							<li>{{ $error }}</li>
						@endforeach
					</ul>
				</div>
			@endif
			<div class="row">
				<div class="col-xs-12">
					<!-- PAGE CONTENT BEGINS -->

					<form class="form-horizontal" role="form" action="{{ url('admin/goods') }}" method='post'  enctype="multipart/form-data">
						{{ csrf_field() }}
						<div class="form-group">
							<label class="col-sm-3 control-label no-padding-right" for="form-field-1"> 商品标题 </label>

							<div class="col-sm-9">
								<input type="text" id="form-field-1" placeholder="商品标题" class="col-xs-10 col-sm-5"  name='title'/>
							</div>
						</div>
						
						<div class="form-group">
							<label class="col-sm-3 control-label no-padding-right" for="form-field-1"> 商品价格 </label>

							<div class="col-sm-9">
								<input type="text" id="form-field-1" placeholder="商品价格" class="col-xs-10 col-sm-5" name='price'/>
							</div>
						</div>

						<div class="space-4"></div>

						<div class="form-group">
							<label class="col-sm-3 control-label no-padding-right" for="form-input-readonly"> 商品简介 </label>

							<div class="col-sm-9">
								<textarea id="form-field-11" class=" col-sm-5 " rows="8px" name="summary" style='resize:none;' placeholder="商品描述"></textarea>
							</div>
						</div>

						<div class="space-4"></div>

						<div class="form-group">
							<label class="col-sm-3 control-label no-padding-right" for="form-field-4">栏目</label>

							<div class="col-sm-9">
								<div class="space-2"></div>
									<select name = "cid" id = "type">
										<option value="">--请选择--</option>
									</select>
								<div class="help-block" id="input-size-slider"></div>
							</div>
						</div>

						<div class="form-group">
							<label class="col-sm-3 control-label no-padding-right" for="form-field-5">商品图片</label>
   
      
							<div class="col-sm-9">
								<div class="clearfix">
									<!-- <img src="" alt=""> -->
									<img id="imageview" width='300px' height = '300px' >
									<input id="fileupload" type="file" name='pic'/>  
									<!-- <input type="file" name="views"> -->
								</div>
							</div>
						</div>

						

						<div class="clearfix form-actions">
							<div class="col-md-offset-3 col-md-9">
								<button class="btn btn-info" type="submit">
									<i class="icon-ok bigger-110"></i>
									提交
								</button>

								&nbsp; &nbsp; &nbsp;
								<button class="btn" type="reset">
									<i class="icon-undo bigger-110"></i>
									重置
								</button>
							</form>
						</div>
					</div>
				</div><!-- /.col -->
			</div><!-- /.row -->
		</div><!-- /.page-content -->
	</div><!-- /.main-content -->
	<script type="text/javascript" src='{{ asset("js/jquery-1.8.3.min.js") }}'></script>
	<script type="text/javascript">
		// $.ajaxSetup({
		//     headers: {
		//         'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
		//     }
		// });
		// $.ajax({
		// 	url:"{{ url('admin/ajax/get') }}",
		// 	type:'get',
		// 	async:true,
		// 	data:{upid:0},
		// 	dataType:'json',

		// 	success:function(data)
		// 	{
		// 		// console.log(data);
		// 		//遍历从数据库查出来的数据，生成option选项追加到select里
		// 		for (var i = 0; i < data.length; i++) { 
		// 			$('#type').append("<option value="+data[i].id+">"+data[i].name+"</option>");
		// 		};
		// 	},
		// 	error:function()
		// 	{
		// 		alert('ajax请求失败');
		// 	}
		// });

		// //给所有的select标签绑定change事件
		// $('select').live("change",function(){
		// 	//干掉当前你选择的select标签后面的select标签
		// 	$(this).nextAll('select').remove();
		// 	//判断你选择是不是--请选择--
		// 	if($(this).val() != '--请选择--'){
		// 		//因为在ajax的回调函数中需要使用当前对象，但是$(this)在ajax的回调函数中用不了
		// 		var ob = $(this);
		// 		$.ajax({
		// 			url:"{{ url('admin/ajax/post') }}",
		// 			type:'get',
		// 			async:true,
		// 			// ,'_token':"{{ csrf_token() }}"
		// 			data:{upid:$(this).val()},
		// 			dataType:'json',
		// 			success:function(data)
		// 			{
		// 				// alert(data);
		// 				// console.log(data);
		// 				//判断是不是最后一级城市，最后一级城市查数据库length==0
		// 				if(data.length>0){
		// 					//生成一个新的select标签
		// 					var select = $("<select name='cid'><option>--请选择--</option></select>");
		// 					//遍历从数据库查出来的数据，生成option选项追加到select里
		// 					for (var i = 0; i < data.length; i++) {
		// 						$(select).append("<option value="+data[i].id+">"+data[i].name+"</option>");
		// 					};
		// 					//外部插入到前一个select后面
		// 					ob.after(select);
		// 				}
		// 			},
		// 			error:function()
		// 			{
		// 				alert('ajax请求失败');
		// 			}
		// 		});
		// 	}
		// });


		// //上传头像之后立即显示
		// $(function() {  
		//     //原理是把本地图片路径："D(盘符):/image/..."转为"http://..."格式路径来进行显示图片 
		//     $("#fileupload").change(function() {  
		//         var $file = $(this);  
		//         var objUrl = $file[0].files[0];  
		//         //获得一个http格式的url路径:mozilla(firefox)||webkit or chrome  
		//         var windowURL = window.URL || window.webkitURL;  
		//         //createObjectURL创建一个指向该参数对象(图片)的URL  
		//         var dataURL;  
		//         dataURL = windowURL.createObjectURL(objUrl);  
		//         $("#imageview").attr("src",dataURL);  
		//     });  
		// }); 
	
		$.ajaxSetup({
		    headers: {
		        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
		    }
		});
		$.ajax({
			url:"{{ url('admin/ajax/get') }}",
			type:'get',
			async:true,
			data:{upid:0},
			dataType:'json',

			success:function(data)
			{
				// alert(1111111);
				// console.log(data);
				//遍历从数据库查出来的数据，生成option选项追加到select里
				for (var i = 0; i < data.length; i++) { 
					$('#type').append("<option value="+data[i].id+">"+data[i].name+"</option>");
				};
			},
			error:function()
			{
				alert('ajax请求失败');
			}
		});

		//给所有的select标签绑定change事件
		$('select').live("change",function(){
			//干掉当前你选择的select标签后面的select标签
			$(this).nextAll('select').remove();
			//判断你选择是不是--请选择--
			if($(this).val() != '--请选择--'){
				//因为在ajax的回调函数中需要使用当前对象，但是$(this)在ajax的回调函数中用不了
				var ob = $(this);
				$.ajax({
					url:"{{ url('admin/ajax/post') }}",
					type:'get',
					async:true,
					// ,'_token':"{{ csrf_token() }}"
					data:{upid:$(this).val()},
					dataType:'json',
					success:function(data)
					{
						// alert(11111);
						// console.log(data);
						//判断是不是最后一级，最后一级查数据库length==0
						if(data.length>0){
							//生成一个新的select标签
							var select = $("<select name='cid'><option>--请选择--</option></select>");
							//遍历从数据库查出来的数据，生成option选项追加到select里
							for (var i = 0; i < data.length; i++) {
								$(select).append("<option value="+data[i].id+">"+data[i].name+"</option>");
							};
							//外部插入到前一个select后面
							ob.after(select);
						}
					},
					error:function()
					{
						alert('ajax请求失败');
					}
				});
			}
		});


		//上传头像之后立即显示
		$(function() {  
		    //原理是把本地图片路径："D(盘符):/image/..."转为"http://..."格式路径来进行显示图片 
		    $("#fileupload").change(function() {  
		        var $file = $(this);  
		        var objUrl = $file[0].files[0];  
		        //获得一个http格式的url路径:mozilla(firefox)||webkit or chrome  
		        var windowURL = window.URL || window.webkitURL;  
		        //createObjectURL创建一个指向该参数对象(图片)的URL  
		        var dataURL;  
		        dataURL = windowURL.createObjectURL(objUrl);  
		        $("#imageview").attr("src",dataURL);  
		    });  
		}); 
	 </script>
@endsection